<script setup>
import {ref} from "vue";
import apis from "@/request/apis.js";
import {useRouter} from "vue-router";
import {useStore} from "vuex";

const username = ref("");
const password = ref("");

const store = useStore();
const router = useRouter();

const login = async () => {
  const loginInfo = await apis.post("/square-lake/auth/b/doLogin", {
    userName: username.value,
    password: password.value
  });
  if (!loginInfo) {
    return;
  }
  console.log(loginInfo)
  store.state.userInfo.username = username.value;
  store.state.userInfo.password = password.value;
  store.state.userInfo.token = loginInfo;
  store.state.userInfo.isLogin = true;
  let data = JSON.stringify({
    username: store.state.userInfo.username,
    token: store.state.userInfo.token,
    password: store.state.userInfo.password,
    isLogin: store.state.userInfo.isLogin
  })
  // console.log(data);
  // 构造函数
  window.sessionStorage.setItem("userInfo", data);
  // 跳转首页
  router.push("/");
}
</script>

<template>


  <div>
    <section>
      <div class="box">
        <!-- 登录框 -->
        <div class="container">
          <div class="form">
            <h2>登录</h2>
            <form>
              <div class="inputBox">
                <input type="text" v-model="username" placeholder="用户名">

              </div>
              <div class="inputBox">
                <input type="password" v-model="password" placeholder="密码">

              </div>
              <div class="inputBox">
                <input type="button" value="登录" @click="login">

              </div>

            </form>
          </div>
        </div>
      </div>
    </section>

  </div>
</template>

<style scoped>

</style>